<!doctype html>
<html class="no-js" lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>Daxone - eCommerce Bootstrap 4 Template</title>
    <meta name="robots" content="noindex, follow" />
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- Favicon -->
    <link rel="shortcut icon" type="image/x-icon" th:href="@{/assets/images/favicon.png}">

    <!-- CSS
	============================================ -->

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" th:href="@{/assets/css/vendor/bootstrap.min.css}">
    <!-- Icon Font CSS -->
    <link rel="stylesheet" th:href="@{/assets/css/vendor/line-awesome.css}">
    <link rel="stylesheet" th:href="@{/assets/css/vendor/themify.css}">
    <!-- othres CSS -->
    <link rel="stylesheet" th:href="@{/assets/css/plugins/animate.css}">
    <link rel="stylesheet" th:href="@{/assets/css/plugins/owl-carousel.css}">
    <link rel="stylesheet" th:href="@{/assets/css/plugins/slick.css}">
    <link rel="stylesheet" th:href="@{/assets/css/plugins/magnific-popup.css}">
    <link rel="stylesheet" th:href="@{/assets/css/plugins/jquery-ui.css}">
    <link rel="stylesheet" th:href="@{/assets/css/style.css}">
	
	<!-- 倒计时字体 -->
	<style type="text/css">
	h1{font-family:"微软雅黑";font-size:40px;margin:20px 0;;border-bottom:solid 1px #ccc;padding-bottom:20px;letter-spacing:2px;}
	
	.time-item strong{background:#C71C60;color:#fff;line-height:49px;font-size:10px;font-family:Arial;padding:0 10px;margin-right:10px;border-radius:5px;box-shadow:1px 1px 3px rgba(0,0,0,0.2);}
	#day_show{float:left;line-height:49px;color:#c71c60;font-size:10px;margin:0 10px;font-family:Arial, Helvetica, sans-serif;}
	.item-title .unit{background:none;line-height:49px;font-size:24px;padding:0 10px;float:left;}

        /*搜索按钮 */
    #searchbtn:hover{
        color:#999;
        transform: scale(2.0);
        cursor:pointer;
    }

	</style>


<!--    <style>-->
<!--        slider-area .nav-style-1.nav-dot-left .owl-nav {-->
<!--            left: 70px;-->
<!--            top: 350px;-->
<!--        }-->
<!--        .slider-area .dot-style-1 .owl-dots {-->
<!--            left: 70px;-->
<!--            top: 350px;-->
<!--        }-->
<!--    </style>-->

</head>

<body>
<!-- 导航栏 -->
<div class="main-wrapper">
    <div th:include="headerfooter :: header"></div>


        <div class="slider-area">
            <div class="slider-active owl-carousel nav-style-1 dot-style-1 nav-dot-left">
                <div class="single-slider height-100vh bg-img" data-dot="01" style="background-image:url(/assets/images/slider/hm1-bg-1.jpg);">
                    <div class="container">
                        <div class="row align-items-center">
                            <div class="col-lg-7 col-md-6 col-12 col-sm-6">
                                <div class="slider-sin-img-hm1 slider-sin-mrg1 slider-animated-1">
                                    <img class="animated" th:src="@{/assets/images/slider/slider1.png}" style="height: auto;width: auto;max-height: 100%;max-width: 100%" alt="">
                                </div>
                            </div>
                            <div class="col-lg-5 col-md-6 col-12 col-sm-6">
                                <div class="slider-content-1 slider-animated-1 ml-70">
                                    <h3 class="animated">易拍拍卖</h3>
                                    <h1 class="animated" style="font-size: 50px;">狂欢盛宴</h1>
                                    <p class="animated">千万好品，一元起拍</p>
									<div class="row">
										<div class="slider-btn-1 default-btn btn-hover col-sm-4">
										    <a class="animated btn-color-theme btn-size-md btn-style-outline" href="/goodlist">加入</a>
										</div>
									</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="single-slider height-100vh bg-img" data-dot="02" th:style="'background-image:url('+@{/assets/images/slider/hm1-bg-1.jpg}+');'">
                    <div class="container">
                        <div class="row align-items-center">
                            <div class="col-lg-7 col-md-6 col-12 col-sm-6">
                                <div class="slider-sin-img-hm1 slider-sin-mrg1 slider-animated-1">
                                    <img class="animated" th:src="@{/assets/images/slider/slider2.png}" style="height: auto;width: auto;max-height: 100%;max-width: 100%" alt="">
                                </div>
                            </div>
                            <div class="col-lg-5 col-md-6 col-12 col-sm-6">
                                <div class="slider-content-1 slider-animated-1 ml-70">
                                    <h3 class="animated">易拍拍卖</h3>
                                    <h1 class="animated" style="font-size: 50px;">狂欢盛宴</h1>
                                    <p class="animated">千万好品，一元起拍</p>
                                    <div class="row">
                                        <div class="slider-btn-1 default-btn btn-hover col-sm-4">
                                            <a class="animated btn-color-theme btn-size-md btn-style-outline" href="/goodlist">加入</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>



            </div>
        </div>
        <div class="banner-area pt-100 pb-100">
            <div class="container">
                <div class="bg-img pt-100 pb-100 learn-banner" th:style="'background:url('+@{(${onetheme.url})}+');'">
                    <div class="row">
                        <div class="col-lg-10 col-md-10 col-sm-11">
                            <div class="banner-content">
                                <h2>[[${onetheme.title}]]<br>[[${onetheme.content}]]</h2>
                                    <a th:href="@{(${onetheme.href})}">了解详情</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="product-area pb-135">
            <div class="container">
                <div class="section-title text-center mb-40">
                    <h2>热门拍品</h2>
                    <!-- ==================== -->
                    <div class="dropdown">
                        <button type="button" class="btn dropdown-toggle" id="dropdownMenu1"
                                data-toggle="dropdown">
                            点我试试
                            <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
                            <li role="presentation">
                                <a role="menuitem" tabindex="-1" href="/index/1">按围观数推荐</a>
                            </li>
                            <li role="presentation">
                                <a role="menuitem" tabindex="-1" href="/index/2">按报名数推荐</a>
                            </li>
                            <li role="presentation">
                                <a role="menuitem" tabindex="-1" href="/index/3">按竞拍数推荐</a>
                            </li>
                        </ul>
                    </div>
                    <!-- ==================== -->
                </div>
                <div class="product-slider-active owl-carousel">
                    <div class="product-wrap" th:each="recommend:${recommends}">
                        <div class="product-img mb-15">
                            <a th:href="@{|/good/goodDetail.html?gid=${recommend.gid}|}"><img th:src="${recommend.url}" alt="product" style="height: 300px;"></a>
							<span class="price-dec" style="width: 80px;height: 40px;background-color: orangered;color: snow;border-radius: 20%;" th:if="${cond==1}">[[${recommend.circuseeNo}]]人围观</span>
                            <span class="price-dec" style="width: 80px;height: 40px;background-color: deepskyblue;color: snow;border-radius: 20%;" th:if="${cond==2}">[[${recommend.signupNo}]]人报名</span>
                            <span class="price-dec" style="width: 80px;height: 40px;background-color: lightgreen;color: saddlebrown;border-radius: 20%;" th:if="${cond==3}">[[${recommend.bidNo}]]次竞拍</span>
                            <!--<span class="price-dec">[[${recommend.bidNo}]]</span>-->
                            <div class="product-action">
                                <a title="收藏" th:href="@{|/good/veUserConnection?gid=${recommend.gid}|}"><i class="la la-heart-o"></i></a>
                            </div>
                        </div>
                        <div class="product-content">
                            <h4 style="text-align: center"><a th:href="@{|/good/goodDetail.html?gid=${recommend.gid}|}">[[${recommend.title}]]</a></h4>
                            <div>
                                <h4 style="text-align: center">起拍价格：￥[[${recommend.startPrice}]]</h4>
                            </div>
                        </div>
                        <span th:id="item-endtime+${recommend.gid}" style="display: none">[[${recommend.durationSeconds}]]</span>
                        <span class="item-rid" style="display: none">[[${recommend.gid}]]</span>
						<div class="time-item" style="text-align: center">
							<span th:id="day_show+${recommend.gid}">0天</span>
							<strong th:id="hour_show+${recommend.gid}">0时</strong>
							<strong th:id="minute_show+${recommend.gid}">0分</strong>
							<strong th:id="second_show+${recommend.gid}">0秒</strong>
						</div>
                    </div>
                </div>
            </div>
        </div>
        <div class="discount-area pb-100">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-lg-7 col-md-6">
                        <div class="discount-img">
                            <a href="#">
                                <img style="height: 500px" th:src="@{(${exgood.url})}" alt="discount-img">
                            </a>
                        </div>
                    </div>
                    <div class="col-lg-5 col-md-6">
                        <div class="discount-content">
                                <h1>[[${exgood.title}]]</h1>
                                <h2 id="it-text">最高拍卖价<br>[[${exgood.nowPrice}]]￥</h2>
                                    <p class="bright-color" style="font-size: 30px">围观人数：[[${exgood.circuseeNo}]]<img th:if="${exgood.circuseeNo gt 30}" src="/assets/images/blog/hot.png"></p>
                                    <p class="bright-color" style="font-size: 30px">报名人数：[[${exgood.signupNo}]]<img th:if="${exgood.signupNo gt 30}" src="/assets/images/blog/hot.png"></p>
                                    <p class="bright-color" style="font-size: 30px">竞拍次数：[[${exgood.bidNo}]]<img th:if="${exgood.bidNo gt 30}" src="/assets/images/blog/hot.png"></p>
                                    <br>
                                    <div class="discount-btn default-btn btn-hover">
                                        <a class="btn-color-theme btn-size-md btn-style-outline" th:href="@{|/good/goodDetail.html?gid=${exgood.gid}|}">查看详情</a>
                                    </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="product-area pb-60">
            <div class="container">
                <div class="section-title text-center mb-40">
                    <h2>产品主题</h2>
                </div>
                <div class="row">
                    <div class="col-xl-3 col-lg-4 col-md-6 col-sm-6">
                        <div class="product-wrap mb-35">
                            <div class="product-img mb-15">
								<span class="price-dec">HOT</span>
                                <a href="/today?goodType=1"><img src="/assets/images/product/comic.png" alt="product"></a>
                            </div>
                            <div class="product-content">
                                <h4 style="text-align: center;font-size: 30px;"><a href="/today?goodType=1">游戏周边</a></h4>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-4 col-md-6 col-sm-6">
                        <div class="product-wrap mb-35">
                            <div class="product-img mb-15">
                                <a href="/today?goodType=2"><img src="/assets/images/product/life.png" alt="product"></a>
                                
                            </div>
                            <div class="product-content">
								
                                <h4 style="text-align: center;font-size: 30px;"><a href="/today?goodType=2">生活用品</a></h4>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-4 col-md-6 col-sm-6">
                        <div class="product-wrap mb-35">
                            <div class="product-img mb-15">
								<span class="price-dec">HOT</span>
                                <a href="/today?goodType=3"><img src="/assets/images/product/ele.png" alt="product"></a>
                               
                            </div>
                            <div class="product-content">
                                <h4 style="text-align: center;font-size: 30px;"><a href="/today?goodType=3">手机电脑</a></h4>
                                
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-4 col-md-6 col-sm-6">
                        <div class="product-wrap mb-35">
                            <div class="product-img mb-15">
                                <a href="/today?goodType=4"><img src="/assets/images/product/music.png" alt="product"></a>
                            </div>
                            <div class="product-content">
                                <h4 style="text-align: center;font-size: 30px;"><a href="/today?goodType=4">乐器专辑</a></h4>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-4 col-md-6 col-sm-6">
                        <div class="product-wrap mb-35">
                            <div class="product-img mb-15">
                                <a href="/today?goodType=5"><img src="/assets/images/product/gold.jpg" alt="product"></a>
                                
                            </div>
                            <div class="product-content">
                                <h4 style="text-align: center;font-size: 30px;"><a href="/today?goodType=5">金银首饰</a></h4>
                                
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-4 col-md-6 col-sm-6">
                        <div class="product-wrap mb-35">
                            <div class="product-img mb-15">
                                <a href="/today?goodType=6"><img src="/assets/images/product/sport.png" alt="product"></a>
                                
                            </div>
                            <div class="product-content">
                                <h4 style="text-align: center;font-size: 30px;"><a href="/today?goodType=6">运动健身</a></h4>
                               
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-4 col-md-6 col-sm-6">
                        <div class="product-wrap mb-35">
                            <div class="product-img mb-15">
                                <a href="/today?goodType=7"><img src="/assets/images/product/antique.png" alt="product"></a>
                               
                            </div>
                            <div class="product-content">
                                <h4 style="text-align: center;font-size: 30px;"><a href="/today?goodType=7">古玩珍品</a></h4>
                               
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-4 col-md-6 col-sm-6">
                        <div class="product-wrap mb-35">
                            <div class="product-img mb-15">
                                <a href="/today?goodType=8"><img src="/assets/images/product/other.png" alt="product"></a>
                               
                            </div>
                            <div class="product-content">
                                <h4 style="text-align: center;font-size: 30px;"><a href="/today?goodType=8">其他主题</a></h4>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- 尾部 -->
    <div th:include="headerfooter :: footer"></div>
    </div>
    <!-- JS


============================================ -->

    <!-- Modernizer JS -->
    <script th:src="@{/assets/js/vendor/modernizr-3.6.0.min.js}"></script>
    <!-- Modernizer JS -->
    <script th:src="@{/assets/js/vendor/jquery-3.3.1.min.js}"></script>
    <!-- Popper JS -->
    <script th:src="@{/assets/js/vendor/popper.js}"></script>
    <!-- Bootstrap JS -->
    <script th:src="@{/assets/js/vendor/bootstrap.min.js}"></script>

    <!-- Slick Slider JS -->
    <script th:src="@{/assets/js/plugins/countdown.js}"></script>
    <script th:src="@{/assets/js/plugins/counterup.js}"></script>
    <script th:src="@{/assets/js/plugins/images-loaded.js}"></script>
    <script th:src="@{/assets/js/plugins/isotope.js}"></script>
    <script th:src="@{/assets/js/plugins/instafeed.js}"></script>
    <script th:src="@{/assets/js/plugins/jquery-ui.js}"></script>
    <script th:src="@{/assets/js/plugins/jquery-ui-touch-punch.js}"></script>
    <script th:src="@{/assets/js/plugins/magnific-popup.js}"></script>
    <script th:src="@{/assets/js/plugins/owl-carousel.js}"></script>
    <script th:src="@{/assets/js/plugins/scrollup.js}"></script>
    <script th:src="@{/assets/js/plugins/waypoints.js}"></script>
    <script th:src="@{/assets/js/plugins/slick.js}"></script>
    <script th:src="@{/assets/js/plugins/wow.js}"></script>
    <script th:src="@{/assets/js/plugins/textillate.js}"></script>
    <script th:src="@{/assets/js/plugins/elevatezoom.js}"></script>
    <script th:src="@{/assets/js/plugins/sticky-sidebar.js}"></script>
    <script th:src="@{/assets/js/plugins/smoothscroll.js}"></script>
    <!-- Main JS -->
    <script th:src="@{/assets/js/main.js}"></script>

<!-- ============================================================================================ -->

<script type="text/javascript">

        var ids = $(".item-rid");
        console.log("ids------>"+ids.length);
        ids.each(function(){
            var id = $(this).html();
            console.log("id------>"+id);
            var intDiff = $("#item-endtime"+id).html();

            console.log("intdiff------>"+intDiff);
            //intDiff

            function timer(){
                //var end = $(".item-close");
                //window.setInterval(function(){
                var day=0,
                    hour=0,
                    minute=0,
                    second=0;//时间默认值
                if(intDiff > 0){
                    day = Math.floor(intDiff / (60 * 60 * 24));
                    hour = Math.floor(intDiff / (60 * 60)) - (day * 24);
                    minute = Math.floor(intDiff / 60) - (day * 24 * 60) - (hour * 60);
                    second = Math.floor(intDiff) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
                    // console.log("=========="+second)
                }
                if (minute <= 9) minute = '0' + minute;
                if (second <= 9) second = '0' + second;
                $('.time-item #day_show'+id).html(day+"天");
                $('.time-item #hour_show'+id).html('<s id="h"></s>'+hour+'时');
                $('.time-item #minute_show'+id).html('<s></s>'+minute+'分');
                $('.time-item #second_show'+id).html('<s></s>'+second+'秒');
                intDiff--;
                //}, 1000);
            }
            setInterval(timer,1000);
        })



		</script>


<!-- ============================================== -->
<script>
    $(function() {

        $('#it-toggle-button').on( 'click', function() {
            $('#it-text').toggleClass('it-animate');
            return false;
        });

    });



    function searchgood(){
        var searchContext = $("#searchinput").val();
        window.location.href = "/goodlist?searchContext="+searchContext;
    }


</script>






</body>

</html>